<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>WebRTC Camera (PC)</title>
    <style>
	#localVideo
	{
		background-color:#CF3;	
	}
	
	
	</style>
    
    
</head>
<body>
    <video id="localVideo" autoplay playsinline muted></video>

    <script>
	//console.log('aklsdhgklhfgkjhkdfgh');
        const localVideo = document.getElementById('localVideo');

        let localStream;
        let peerConnection;
        const ws = new WebSocket('wss://192.168.0.120:8888'); // 替换为信令服务器的 IP 和端口

        // 初始化 RTCPeerConnection
        function createPeerConnection() {
            peerConnection = new RTCPeerConnection({
                //iceServers: [{ urls: 'stun:stun.l.google.com:19302' }] // 使用 Google 的公共 STUN 服务器
            });

            // 处理远程视频流
            peerConnection.ontrack = (event) => {
                console.log('Received track:', event.track);
                if (event.track.kind === 'video') {
                    const video = document.getElementById('remoteVideo');
                    video.srcObject = event.streams[0];
                    video.play(); // 确保视频播放
                }
            };

            // 处理 ICE Candidate
            peerConnection.onicecandidate = (event) => {
                if (event.candidate) {
					console.log('Candidate send');
                    ws.send(JSON.stringify({ type: 'candidate', candidate: event.candidate }));
                }
            };
        }

        // WebSocket 消息处理
        ws.onmessage = async (message) => {
            const data = JSON.parse(message.data);
            console.log('Received data:', data);

            if (data.type === 'answer') {
                // 收到 Answer，设置远程描述
                await peerConnection.setRemoteDescription(new RTCSessionDescription(data.answer));
            } else if (data.type === 'candidate') {
                // 收到 ICE Candidate，添加到连接中
                await peerConnection.addIceCandidate(new RTCIceCandidate(data.candidate));
            }
        };

        // 启动摄像头
        async function startCamera() {
            try {
				const constraints = {
					video: true,
					audio: false // 明确禁用音频
				};
                localStream = await navigator.mediaDevices.getUserMedia(constraints)
                localVideo.srcObject = localStream;
				console.log('successs open video');
                // 创建 RTCPeerConnection
                createPeerConnection();

                // 添加本地视频流到连接中
                localStream.getTracks().forEach(track => {
                    peerConnection.addTrack(track, localStream);
                });

                // 创建 Offer
                const offer = await peerConnection.createOffer();
                await peerConnection.setLocalDescription(offer);

                // 发送 Offer 到信令服务器
                ws.send(JSON.stringify({ type: 'offer', offer: offer }));
            } catch (error) {
                console.error('Error accessing camera:', error);
            }
        }

        // 当 WebSocket 连接成功后，自动启动摄像头
        ws.onopen = () => {
            startCamera();
        };
		
//C++ 调用showalert函数
			function showalert() 
			{
				alert("asdfg")
			}
			//C++ 调用getJsData函数
function getJsData() 
{
	return "C++ Call JS demo"
}	

		
    </script>
</body>
</html>